<template>
  <div class="application">
    <x-header :left-options="{backText: ''}">提现申请</x-header>
    <div class="fa t10 r15" style="z-index: 999;" @click="goTo()">完成</div>
    <div class="">
      <div class="bankList pl15 fr">
        <img src="../../assets/applicationEnd.png" alt="" style="vertical-align: middle;margin-top:17px;" width="25">
        <div class="fa" style="left:50px;top: 15px">
          <div style="vertical-align: middle;color:#fea620;font-size:16px;">提现申请已提交,等待人工审核</div>
          <div style="color: #999;font-size:13px;">
            <span v-for="bank in bankDetail">{{bank.name.split("银行")[0]}}银行({{bank.count.substr(bank.count.length-4)}})</span>
          </div>
        </div>
      </div>
      <div class="bankList pl15 bt fr">
        <img src="../../assets/applicationStart.png" alt="" width="25">
        <span style="vertical-align: middle;color: #666;bottom: 10px;left:50px;font-size:16px;" class="fa">预计到账时间:{{dateTime}}</span>
      </div>
    </div>
  </div>
</template>
<script>
  import { XHeader } from 'vux'
  import http from '../../service/http.js'
  export default {
    data() {
      return {
        dateTime: '',
        bankDetail:[],
        id:""
      }
    },
    mounted(){
      this.id= this.$route.query.id
      var date=new Date()
      this.dateTime = date.getFullYear() + "-" + parseInt(date.getMonth() + 1) + "-" + parseInt(date.getDate() +2)+ " " + " " + date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds()
      this.getBankList();
    },
    methods: {
      getBankList(){
        http.get("/user/bank").then((res)=>{
           if(res.status==200){
             console.log(res.data.body);
             res.data.body.forEach((v)=>{
               if(v.id==this.id){
                  this.bankDetail.push(v);
               }
             })
           }
        })
      },
      goTo(){
        history.back();
      }
    },
    components: {
      XHeader,
    }
  }
</script>
<style lang="less">
  body {
    background: #f6f6f6;
  }

  .application .vux-header {
    background: #fff;
  }

  .application .fa {
    position: absolute;
  }

  .application .fr {
    position: relative;
  }

  .application .r15 {
    right: 15px;
  }

  .application .t10 {
    top: 10px;
  }

  .application .mgT10 {
    margin-top: 10px;
  }

  .application .bg {
    background: #fff;
  }

  .application .pl15 {
    padding-left: 15px;
  }

  .application .bt {
    border-bottom: 1px solid #f6f6f6;
  }

  /* .application .bankList {
      height: 50px;
      line-height: 50px;
    } */

  .application .vux-header .vux-header-title {
    line-height: 40px;
    text-align: center;
    font-size: 18px;
    font-weight: 400;
    color: #000;
  }

  .application .vux-header .vux-header-left .left-arrow:before {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    border: 1px solid #000;
    border-width: 1px 0 0 1px;
    -webkit-transform: rotate(315deg);
    transform: rotate(315deg);
    top: 8px;
    left: 7px;
  }
</style>